<template>
  <article class="page">
    <headerbar>课程列表</headerbar>

    <section class="frame-content-sub bg-light-gray  list-news-img list-wenda">

      <cube-scroll
        ref="scroll"
        :options="options"
        @pulling-up="onPullingUp"
      >

        <div class="item mgt-2 block" @click="goDetail(item)" v-for="(item,index) in list" :key="index">
          <div class="icon">
            <span class="icon-text">课</span>
          </div>
          <div class="cont">
            <h2 class="title">{{item.name}}</h2>
            <div class="tip">
              <span>计划名称： {{trainingclass}}</span>
            </div>
            <div class="tip">
              <span>课程时间： {{item.beginData}} - {{item.endData}}</span>
            </div>
            <div class="tip">
              <span>讲师名称： {{item.lecturerName}}</span>
              <span>学时： {{item.classHour}}</span>
            </div>
          </div>
        </div>

        <noData v-if="!hasList() && !isLoading"></noData>
      </cube-scroll>



    </section>
  </article>
</template>

<script>
  export default {
    name: 'classList',
    data () {
      return {
        currentIndex: 0,
        pageIndex: 1,
        pageSize: 10,
        menuId: '',
        isLoading: true,
        institutionsName: '',
        menuList: [],
        list: [],
        options: {
          pullUpLoad: true,
          scrollbar: false
        }
      }
    },
    created () {
//      if (this.$route.query.id === undefined) {
//        return this.$router.replace({name: 'trainingplanClassList'})
//      }
//      this.institutionsName = this.$route.query.institutionsName
      this.fetchList()
    },
    methods: {
      fetchUserinfo () {
        let token = this.$sessionStorage.get('token')
        this.fetchService.userinfo({access_token: token}).then(res => {

        })
      },
      goDetail (item) {
//        this.$store.state.redCloudNewsDetail = item
//        this.$router.push({name: 'redCloudNewsDetail', params: {id: item.id}})
      },
      clickMenu (item, index) {
        this.currentIndex = index
        this.menuId = item.id
        this.pageIndex = 1
        this.list = []
        this.fetchList(item.id)
      },
      fetchList (id) {
        this.isLoading = true
        id = id || this.menuId
        let data = {
//          "classId": this.$route.query.id,
//          "id": "1",
//          "modular": "1",
//          "name": "1",
          "page": this.pageIndex,
          "limit": this.pageSize
        }
        return this.fetchService.classList(data).then(res => {
          if (res.code !== 0) {
            return this.tools.alert(res.message || res.resp_msg)
          }
          this.isLoading = false
          this.$refs.scroll.forceUpdate && this.$refs.scroll.forceUpdate(true, false)
          this.pageIndex ++
          this.list = this.list.concat(res.data)
          if (res.data.length == 0) {
            this.tools.tip('暂无更多')
          }
          return res
        })
      },
      hasList () {
        return this.list.length > 0
      },
      onPullingUp () {
        this.fetchList().then(res => {
          setTimeout(() => {
            this.$refs.scroll.forceUpdate && this.$refs.scroll.forceUpdate(true, false)
            this.options.isPullUpLoad = false
          }, 100)
        })
      }
    }
  }
</script>
<style lang="scss" scoped="">
  .list-news-img .item .cont .title {
    margin-bottom:15px;
    height:auto;
    min-height:1em;
    line-height: normal;
  }
</style>

